<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="css/base.css">
    <link rel="stylesheet" href="css/home.css">
    <link rel="stylesheet" href="css/my.css">
    <title>我的</title>
</head>

<body>
    <div class="container">

        <!-- 头部 -->
        <header>
            <div class="top">
                <p class="title">
                    <span class="icon">&#xe60e;</span> 我的
                    <span class="icon">&#xe600;</span>
                </p>
                <div class="my_info">
                    <div class="user_info">
                        <img src="images/my_userphoto.png" alt="">
                        <p class="name">包小图</p>
                        <a href="login.html">会员</a>
                        <div class="clear"></div>
                        <p class="uid">ID: 14521023</p>
                        <span class="icon">&#xe607;</span>
                    </div>
                    <ul>
                        <li>
                            <img src="images/my_logo1.png" alt="">
                            <p>成就</p>
                            <p>145个</p>
                        </li>
                        <li>
                            <img src="images/my_logo2.png" alt="">
                            <p>成就</p>
                            <p>4580个</p>

                        </li>
                        <li>
                            <img src="images/my_logo3.png" alt="">
                            <p>成就</p>
                            <p>7541个</p>
                        </li>
                    </ul>
                </div>

                <div class="my_infolist">
                    <ul>
                        <li><a href="#"><span class="icon">&#xe60a;</span><span>我的钱包</span><span
                                    class="icon fr">&#xe60b;</span></a>
                        </li>
                        <li><a href="#"><span class="icon">&#xe671;</span><span>我的礼包</span><span
                                    class="icon fr">&#xe60b;</span></a>
                        </li>
                        <li><a href="#"><span class="icon">&#xe62d;</span><span>我的等级</span><span
                                    class="icon fr">&#xe60b;</span></a>
                        </li>
                        <li><a href="#"><span class="icon">&#xe6ab;</span><span>观看记录</span><span
                                    class="icon fr">&#xe60b;</span></a>
                        </li>
                        <li><a href="#"><span class="icon">&#xe63f;</span><span>联系客服</span><span
                                    class="icon fr">&#xe60b;</span></a>
                        </li>
                        <li><a href="#"><span class="icon">&#xe74f;</span><span>信息中心</span><span
                                    class="icon fr">&#xe60b;</span></a>
                        </li>
                        <li><a href="#"><span class="icon">&#xe74b;</span><span>系统设置</span><span
                                    class="icon fr">&#xe60b;</span></a>
                        </li>
                    </ul>

                </div>
            </div>
        </header>


        <!-- 内容底部填充块 -->
        <section>
            <div class="filled"></div>
        </section>

        <!-- 主播工具 -->
        <section>
            <div class="toolscontainer" id="zhubotool">
                <div class="zhubotools">
                    <p>直播工具</p>
                    <ul class="tools_list">
                        <li>
                            <a href="#">
                                <img src="images/zhibo_tools_list01.jpg" alt="">
                                <p>在线直播</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="images/zhibo_tools_list02.jpg" alt="">
                                <p>美颜工具</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="images/zhibo_tools_list03.jpg" alt="">
                                <p>视频管理</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="images/zhibo_tools_list04.jpg" alt="">
                                <p>制作影片</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="images/zhibo_tools_list05.jpg" alt="">
                                <p>字体选择</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="images/zhibo_tools_list06.jpg" alt="">
                                <p>拍短视频</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="images/zhibo_tools_list07.jpg" alt="">
                                <p>发布动态</p>
                            </a>
                        </li>
                        <li>
                            <a href="#">
                                <img src="images/zhibo_tools_list08.jpg" alt="">
                                <p>直播公告</p>
                            </a>
                        </li>
                    </ul>
                </div>
            </div>

        </section>

        <!-- 底部导航栏 -->
        <footer>
            <div class="nav">
                <ul>


                    <li>
                        <a href="home.html">
                            <img src="images/nav_01.png" alt="">
                            <img src="images/nav_active01.png" alt="">
                            <p>首页</p>
                        </a>
                    </li>



                    <li>
                        <a href="cate.html">
                            <img src="images/nav_02.png" alt="">
                            <img src="images/nav_active02.png" alt="">
                            <p>分类</p>
                        </a>
                    </li>


                    <li id="zhubo_tools3" class="zhubo_toolsbtn" onclick="dispZhuBoTools()">
                        <img src="images/nav_center.png" alt="">
                        <div class="mengban"></div>
                    </li>


                    <li>
                        <a href="discover.html">
                            <img src="images/nav_03.png" alt="">
                            <img src="images/nav_active03.png" alt="">
                            <p>发现</p>
                        </a>
                    </li>


                    <li>
                        <a href="my.html">
                            <img src="images/nav_04.png" alt="">
                            <img src="images/nav_active04.png" alt="">
                            <p>我的</p>
                        </a>
                    </li>

                </ul>
            </div>
        </footer>
    </div>


    <script src="js/commen.js"></script>
</body>

</html>